<!DOCTYPE html>
<html lang="en">
<head>
	<title>登录</title>
	<meta charset="UTF-8">
	<meta name="keywords" content="">
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=0">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="black" name="apple-mobile-web-app-status-bar-style">
	<meta content="telephone=no" name="format-detection">

	#parse("common/common.html")

	<link rel="stylesheet" href="#url('static/comm/css/login/login.css')"/>
	<link href="#url('static/comm/css/welcome/bg.css')" rel="stylesheet" type="text/css" />

	<script src="#url('/static/comm/js/MD5.js')"></script>
	<script type="text/javascript">
		if(navigator.userAgent.indexOf("Chrome") <0){
			layer.alert("浏览本系统推荐您使用 谷歌浏览器Chrome",{
				icon: 7,
				kin: 'layer-ext-moon'
			});
		}
//		else {
//			alert(navigator.userAgent);
//		}
		AppComm.include.load("#url('/static/comm/js/login/login.js')","js");
	</script>

</head>
<body class="body_bj">
<div id="particles-js">
	<div class="login">
		<div class="logo"> <img src="#url('static/comm/img/login/logo.png')" alt=""> </div>
		<ul class="login-list">
			<li>
				<input id="username" type="text" placeholder="请输入用户名">
			</li>
			<li>
				<input id="pswd" type="password" placeholder="请输入密码">
			</li>
			<li><a id="loginBtn" class="btn" href="#">登 录</a></li>
			<li>请使用</li>
		</ul>
	</div>
</div>
<script type="text/javascript" src="#url('static/comm/js/login/particles.min.js')"></script>
<script>
	particlesJS('particles-js',
			{
				"particles": {
					"number": {
						"value": 40,  //数量
						"density": {
							"enable": true,
							"value_area": 800
						}
					},
					"color": {
						"value": "#ffffff"
					},
					"shape": {
						"type": "circle",
						"stroke": {
							"width": 0,
							"color": "#000000"
						},
						"polygon": {
							"nb_sides": 5
						},
						"image": {
							"src": "images/github.svg",
							"width": 100,
							"height": 100
						}
					},
					"opacity": {
						"value": 0.3,
						"random": false,
						"anim": {
							"enable": false,
							"speed": 1,
							"opacity_min": 0.1,
							"sync": false
						}
					},
					"size": {
						"value": 3,
						"random": true,
						"anim": {
							"enable": false,
							"speed": 40,
							"size_min": 0.1,
							"sync": false
						}
					},
					"line_linked": {
						"enable": true,
						"distance": 150,
						"color": "#ffffff",
						"opacity": 0.4,
						"width": 1
					},
					"move": {
						"enable": true,
						"speed": 1,
						"direction": "none",
						"random": false,
						"straight": false,
						"out_mode": "out",
						"bounce": false,
						"attract": {
							"enable": false,
							"rotateX": 600,
							"rotateY": 1200
						}
					}
				},
				"interactivity": {
					"detect_on": "canvas",
					"events": {
						"onhover": {
							"enable": true,
							"mode": "grab"
						},
						"onclick": {
							"enable": false,
							"mode": "push"
						},
						"resize": true
					},
					"modes": {
						"grab": {
							"distance": 150,
							"line_linked": {
								"opacity": 1
							}
						},
						"bubble": {
							"distance": 400,
							"size": 40,
							"duration": 2,
							"opacity": 8,
							"speed": 3
						},
						"repulse": {
							"distance": 200,
							"duration": 0.4
						},
						"push": {
							"particles_nb": 4
						},
						"remove": {
							"particles_nb": 2
						}
					}
				},
				"retina_detect": false
			}
	);
</script>
</body>
</html>